import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:get/get.dart';
import 'package:pornhub_app/components/base_refresh/base_refresh_widget.dart';

import 'package:pornhub_app/components/diolog/dialog_alert.dart';
import 'package:pornhub_app/components/no_more/no_data.dart';
import 'package:pornhub_app/model/comics/comics_base.dart';
import 'package:pornhub_app/model/community/community_model.dart';
import 'package:pornhub_app/model/video_base_model.dart';
import 'package:pornhub_app/routes/routes.dart';
import 'package:pornhub_app/utils/extension.dart';
import 'package:pornhub_app/views/mine/watch/controllers/watch_video_page_controller.dart';
import 'package:pornhub_app/views/mine/watch/views/item_video_long_view.dart';
import 'package:pornhub_app/views/douyin/short_video_list_cell.dart';

import '../../../../assets/styles.dart';
import '../../../../components/tab_bar_indicator/easy_fixed_indicator.dart';
import '../../../../utils/color.dart';

class WatchVideoPage extends GetView<WatchVideoPageController> {
  const WatchVideoPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: _buildAppBar(),
        body: DefaultTabController(
          initialIndex: 0,
          length: controller.tabs.length,
          child: Column(
            children: [
              _buildHeaderView(),
              _buildContentList(),
            ],
          ),
        ));
  }

  AppBar _buildAppBar() {
    return AppBar(
      title: const Text("观看记录"),
      actions: [
        IconButton(
          onPressed: () {
            showDialog(
              context: Get.context!,
              builder: (context) {
                return DialogAlert(
                  title: '确定清空？',
                  message: '清空后以往记录将不再展示',
                  onConfirm: () {
                    controller.clearList();
                  },
                  onCancel: () {},
                );
              },
            );
          },
          icon: Image.asset(
            'assets/mine/icon_mine_delete.png',
            width: 17.w,
            height: 17.w,
          ),
        ),
      ],
    );
  }

  _buildHeaderView() {
    return TabBar(
      tabs: controller.tabs.map((v) => Tab(text: v)).toList(),
      controller: controller.tabController,
      isScrollable: true,
      tabAlignment: TabAlignment.start,
      indicatorSize: TabBarIndicatorSize.label,
      indicator: EasyFixedIndicator(
          borderRadius: Styles.borderRadius.m,
          color: COLOR.hexColor("#DC143C"),
          width: 10.w,
          height: 3.w),
      labelStyle: TextStyle(
          color: COLOR.hexColor("#333"),
          fontSize: 16.w,
          fontWeight: FontWeight.bold),
      unselectedLabelStyle:
          TextStyle(color: COLOR.hexColor("#666"), fontSize: 16.w),
      indicatorPadding: EdgeInsets.only(bottom: 8.w),
      dividerColor: Colors.white,
    ).paddingLeft(14.w);
  }

  _buildContentList() {
    return Expanded(
        child: TabBarView(
      controller: controller.tabController,
      children: [
        Obx(() => _videoLoginView(controller.longVideos.value)),
        Obx(() => _postsView(controller.communitys.value)),
        Obx(() => _videoShortView(controller.shorts.value)),

        // Obx(() => _novelView(controller.novels.value)),
      ],
    ));
  }

  //长视频
  _videoLoginView(List<VideoBaseModel> models) {
    return BaseRefreshWidget(
      controller,
      child: Container(
          padding: EdgeInsets.symmetric(horizontal: 14.w),
          child: models.isNotEmpty
              ? ListView.builder(
                  itemCount: models.length,
                  itemBuilder: (BuildContext context, int index) {
                    return GestureDetector(
                      onTap: () {
                        Get.toPlayVideo(videoId: models[index].videoId ?? 0);
                      },
                      child: ItemVideoLongView(models[index]),
                    );
                  },
                )
              : const NoData()),
    );
  }

  //帖子
  _postsView(List<CommunityModel> models) {
    return BaseRefreshWidget(
      controller,
      child: Container(
          padding: EdgeInsets.symmetric(horizontal: 14.w),
          child: models.isNotEmpty
              ? ListView.builder(
                  itemCount: models.length,
                  itemBuilder: (BuildContext context, int index) {
                    return Container();
                    // return CommunityCell(
                    //   data: models[index],
                    // ).onOpaqueTap(() {
                    //   Get.toCommunityDetail(
                    //       dynamicId: models[index].dynamicId ?? 0);
                    // });
                  },
                )
              : const NoData()),
    );
  }

  //短视频(斗阴)
  _videoShortView(List<VideoBaseModel> models) {
    return BaseRefreshWidget(
      controller,
      child: Container(
        padding: EdgeInsets.symmetric(horizontal: 14.w),
        child: models.isNotEmpty
            ? MasonryGridView.count(
                crossAxisCount: 2,
                itemCount: models.length,
                mainAxisSpacing: 8.w,
                crossAxisSpacing: 4.w,
                itemBuilder: (context, index) {
                  final v = models[index];
                  final h =
                      v.height! == 0 ? 273.w : v.height! / v.width! * 173.w;
                  return ShortVideoListCell(
                    width: 183.w,
                    imageHeight: h,
                    model: v,
                  ).onTap(
                    () {
                      Get.toShortVideoPlay(models, idx: index);
                    },
                  );
                },
              ).marginOnly(left: 14.w, right: 14.w)
            : const NoData(),
      ),
    );
  }

  //漫画

  //小说
  // _novelView(List<NovelModel> models) {
  //   return BaseRefreshWidget(
  //     controller,
  //     child: models.length > 0
  //         ? Container(
  //             padding: EdgeInsets.symmetric(horizontal: 14.w),
  //             child: GridView.builder(
  //               gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
  //                 crossAxisCount: 3,
  //                 childAspectRatio: 119.w / 187.h,
  //                 mainAxisSpacing: 14.h,
  //                 crossAxisSpacing: 8.w,
  //               ),
  //               itemCount: models.length,
  //               itemBuilder: (BuildContext context, int index) {
  //                 NovelModel model = models[index];
  //                 return GestureDetector(
  //                   onTap: () {
  //                     Get.toNamed(
  //                       Routes.novel_details,
  //                       arguments: {
  //                         "fictionId": model.fictionId,
  //                       },
  //                     );
  //                   },
  //                   // child: NovelItemView(
  //                   //   novelName: model.fictionTitle,
  //                   //   coverImage: model.coverImg,
  //                   // ),
  //                 ); // Replace with your data
  //               },
  //             ),
  //           )
  //         : NoData(),
  //   );
  // }
}
